<template>
    <el-select v-model="selectVal" filterable placeholder="请选择" @change="change" :disabled="disabled" clearable>
        <el-option v-for="(item,index) in selectArr" :key="index" :label="item.attrName" :value="item.attrCode">
        </el-option>
    </el-select>
</template>

<script>
    import { getAttr } from "@/api/yardPlan/yardPlan";

    export default {
        model: {
            prop:'name',
            event:'select'
        },
        name: "selectAttr",
        props: {
            disabled: {
                type: Boolean,
                default: false,
            },
            name: ''
        },
        data() {
            return {
                infoName:'',
                selectArr: []
            }
        },
        mounted() {
            this.loadData()
        },
        methods: {
            loadData() {
                getAttr().then(res => {
                    this.selectArr = res.data.aaData
                })

                // let selectAttr=JSON.parse(localStorage.getItem('selectAttr'))
                // if(!selectAttr){                
                //     getAttr().then(res => {
                //         this.selectArr = res.data.aaData
                //         localStorage.setItem('selectAttr',JSON.stringify(res.data.aaData))
                //     })
                // }else{
                //     this.selectArr =selectAttr
                // }
            },
            change(val) {
                this.$emit('select',val)
                for (let i = 0; i < this.selectArr.length; i++) {
                    if(this.selectArr[i].attrCode===val){
                        this.$emit('selectName',this.selectArr[i].attrName)
                        console.log(this.selectArr[i].attrName)
                    }
                }
            }
        },
        computed: {
            selectVal:{
                set (val) {
                    let data = ''
                    for (let i = 0; i < this.selectArr.length; i++) {
                        if (val === this.selectArr[i].attrCode) {
                            data = this.selectArr[i]
                        }
                    }
                    this.$emit('change', data)
                    this.$emit('select', val)
                },
                get () {
                    return this.name
                }
            }  
        },
        watch:{
            name(val){
                this.infoName=val
            }
        }
    }
</script>

<style scoped>

</style>
